import React, { Component } from "react";
import ReactDOM from "react-dom";

import {
  BrowserRouter,
  Link,
  Route,
  Router,
  Redirect,
  Switch
} from "react-router-dom";

import Layout from "components/layout/index.jsx";
// 页面
import Home from "page/home/index.jsx";
import ProductRouter from "page/product/router.jsx";

import Login from "page/login/index.jsx";
import OrderList from "page/order/index.jsx";
import OrderDetail from "page/order/detail.jsx";
import UserList from "page/user/index.jsx";
import ErrorPage from "page/error/index.jsx";
export default class App extends React.Component {
  render() { 
    return (
      <BrowserRouter>
        <Switch>
          <Route path="/login" component={Login} />
          <Route
            path="/"
            render={props => (
              <Layout data={props}>
                <Switch>
                  <Route exact path="/" component={Home} />
                  <Route path="/product" component={ProductRouter} />
                  <Route path="/product-category" component={ProductRouter} />
                  <Route path="/order/index" component={OrderList} />
                  {/* <Route path="/order/detail:orderNumber" component={OrderDetail} /> */}
                  <Route path="/order/detail/:orderNumber" component={OrderDetail}/>

                  <Route path="/user/index" component={UserList} />
                  <Redirect exact from='/order' to="/order/index"></Redirect>
                  <Redirect exact from='/user' to="/user/index"></Redirect>
                  <Route component={ErrorPage} />
                </Switch>
              </Layout>
            )}
          />
        </Switch>
      </BrowserRouter>
    );
  }
}

ReactDOM.render(<App />, document.getElementById("app"));
